<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<link rel="icon"
	href="https://jscdn.com.cn/highcharts/images/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
/* css 代码  */
</style>
<script src="https://code.highcharts.com.cn/highcharts/highcharts.js"></script>
<script
	src="https://code.highcharts.com.cn/highcharts/highcharts-more.js"></script>
<script
	src="https://code.highcharts.com.cn/highcharts/modules/exporting.js"></script>
<script
	src="https://img.hcharts.cn/highcharts-plugins/highcharts-zh_CN.js"></script>

</head>
<body>
	<div id="container"
		style="height: 800px; width: 1000px; margin: auto; min-width: 1000px; max-width: 1000px"></div>
	<script>
		var chart = Highcharts
				.chart(
						'container',
						{
							chart : {
								zoomType : 'xy'
							},
							credits : {
								enabled : false
							},
							title : {
								text : ''
							},
							exporting : {
								sourceWidth : 1280,
								sourceHeight : 720,
								scale : 1
							},
							legend : {
								enabled : true,
								itemDistance : 50,
								itemStyle : {
									fontSize : '13px'
								}
							},
							xAxis : {
								categories : [ 'N1', 'N2', 'N3' ],
								title : {
									text : '',
									style : {
										"color" : 'black',
										"cursor" : "default",
										"fontSize" : "16px",
										"fontFamily" : "Time New Roman"
									}
								},
								labels : {
									style : {
										"color" : 'black',
										"cursor" : "default",
										"fontSize" : "16px",
										"fontFamily" : "Time New Roman"
									}
								}
							},
							yAxis : [ { // Primary yAxis
								title : {
									text : 'Average Cmax',
									style : {
										"color" : 'black',
										"cursor" : "default",
										"fontSize" : "16px",
										"fontFamily" : "Time New Roman"
									}
								},
								labels : {
									style : {
										"color" : 'black',
										"cursor" : "default",
										"fontSize" : "16px",
										"fontFamily" : "Time New Roman"
									}
								}
							} ],
							tooltip : {
								shared : true
							},
							plotOptions : {
								errorbar : {
									stemWidth : 3
								}
							},
							series : [
									{
										id : 'DDDQNPR',
										name : 'DDDQNPR',
										type : 'column',
										//color : 'rgb(60,178,239)',
										data : [ 991.8025036, 1007.285081,
												986.9586812 ],
										tooltip : {
											pointFormat : '<span style="font-weight: bold; color: {series.color}">{series.name}</span>: <b>{point.y:.1f} mm</b> '
										}
									},
									{
										name : 'DDDQNPR误差',
										type : 'errorbar',
										color : 'red',
										data : [ [ 974.7342645, 1025.249141 ],
												[ 972.1378884, 1041.46678 ],
												[ 949.7267546, 1051.972573 ] ],
										tooltip : {
											pointFormat : '(误差范围: {point.low}-{point.high} mm)<br/>'
										}
									},
									{
										id : 'GA_PRIORITY_CODE',
										//color : 'rgb(255,174,139)',
										name : 'GA_PRIORITY_CODE',
										type : 'column',
										data : [ 999.1939543, 998.7427458,
												1001.861859 ],
										tooltip : {
											pointFormat : '<span style="font-weight: bold; color: {series.color}">{series.name}</span>: <b>{point.y:.1f} mm</b> '
										}
									},

									{
										name : 'GA_PRIORITY_CODE误差',
										color : 'red',
										type : 'errorbar',
										data : [ [ 974.2285135, 1032.08059 ],
												[ 970.32826, 1028.082257 ],
												[ 967.208374, 1044.380843 ] ],
										tooltip : {
											pointFormat : '(误差范围: {point.low}-{point.high} mm)<br/>'
										}
									},
									{
										id : 'GA_RULE_CODE',
										//color : 'rgb(255,174,139)',
										name : 'GA_RULE_CODE',
										type : 'column',
										data : [ 997.2988447, 996.1036379,
												995.5655447 ],
										tooltip : {
											pointFormat : '<span style="font-weight: bold; color: {series.color}">{series.name}</span>: <b>{point.y:.1f} mm</b> '
										}
									},

									{
										name : 'GA_RULE_CODE误差',
										color : 'red',
										type : 'errorbar',
										data : [ [ 979.519784, 1023.551325 ],
												[ 969.0134717, 1018.256819 ],
												[ 974.0135737, 1030.803982 ] ],
										tooltip : {
											pointFormat : '(误差范围: {point.low}-{point.high} mm)<br/>'
										}
									},
									{
										id : 'Best rule',
										//color : 'rgb(255,174,139)',
										name : 'Best rule',
										type : 'column',
										data : [ 1101.072599, 1101.688193,
												1104.076051 ],
										tooltip : {
											pointFormat : '<span style="font-weight: bold; color: {series.color}">{series.name}</span>: <b>{point.y:.1f} mm</b> '
										}
									},

									{
										name : 'Best rule误差',
										color : 'red',
										type : 'errorbar',
										data : [ [ 1061.048156, 1127.649651 ],
												[ 1064.518728, 1134.069068 ],
												[ 1061.635784, 1197.905441 ] ],
										tooltip : {
											pointFormat : '(误差范围: {point.low}-{point.high} mm)<br/>'
										}
									} ]
						});
	</script>
</body>
</html>